import { type CrudConfig, type FormFieldConfig } from '@/components';
import DICT_CONSTANTS from '@/constants/dictConstants';
import urlConstants from '@/constants/urlConstants';
import type { ProColumns } from '@ant-design/pro-components';
import { Tag } from 'antd';

// 菜单数据类型
export interface MenuRecord {
  resourceId: string;
  resourceName: string;
  resourceUrl: string;
  displayOrder: number;
  permissions: Array<{
    permissionId: string;
    permissionName: string;
  }>;
  icon: string;
  parentId?: string;
  level: number;
  isLeaf: boolean;
}

// 统一的页面配置函数 - 接收 translate 函数作为参数
export const getPageConfig = (translate: (prefix: string, key: string) => string) => {
  const t = (key: string) => translate('systemManage', key);

  return {
    // CRUD配置
    crudConfig: {
      endpoints: {
        list: urlConstants.MENU_MANAGE.LIST,
        create: urlConstants.MENU_MANAGE.EDIT,
        update: urlConstants.MENU_MANAGE.EDIT,
        delete: urlConstants.MENU_MANAGE.DELETE,
        detail: urlConstants.MENU_MANAGE.LIST,
      },
    } as CrudConfig,

    // 搜索字段配置
    searchFields: [
      {
        name: 'resourceName',
        label: t('resourceName'),
        type: 'input' as const,
      },
      {
        name: 'resourceUrl',
        label: t('resourceUrl'),
        type: 'input' as const,
      },
    ],

    // 表格列配置
    columns: [
      {
        title: t('resourceId'),
        dataIndex: 'resourceId',
        key: 'resourceId',
        width: 120,
        fixed: 'left',
      },
      {
        title: t('resourceName'),
        dataIndex: 'resourceName',
        key: 'resourceName',
        width: 180,
        ellipsis: true,
        render: (text: string, record: MenuRecord) => (
          <span style={{ fontWeight: record.level === 1 ? 500 : 400, color: '#1890ff' }}>
            {'  '.repeat(record.level - 1)}
            {text}
          </span>
        ),
      },
      {
        title: t('resourceUrl'),
        dataIndex: 'resourceUrl',
        key: 'resourceUrl',
        width: 260,
        ellipsis: true,
        copyable: true,
      },
      {
        title: t('displayOrder'),
        dataIndex: 'displayOrder',
        key: 'displayOrder',
        width: 100,
        sorter: true,
      },
      {
        title: t('permissions'),
        dataIndex: 'permissions',
        key: 'permissions',
        width: 220,
        render: (text: any, record: MenuRecord) => {
          if (!record.permissions || record.permissions.length === 0) {
            return <Tag color="default">{t('noPermissions')}</Tag>;
          }
          return (
            <div style={{ wordWrap: 'break-word', whiteSpace: 'normal' }}>
              {record.permissions.map((permission, index) => (
                <Tag key={permission.permissionId} color="blue" style={{ marginBottom: 4 }}>
                  {permission.permissionName}
                </Tag>
              ))}
            </div>
          );
        },
      },
      {
        title: t('icon'),
        dataIndex: 'icon',
        key: 'icon',
        width: 110,
        render: (text: string) => {
          if (!text) return <span style={{ color: '#999' }}>{t('noIcon')}</span>;
          return <span>{text}</span>;
        },
      },
      {
        title: t('level'),
        dataIndex: 'level',
        key: 'level',
        width: 80,
        render: (text: number) => <Tag color="geekblue">L{text}</Tag>,
      },
      {
        title: t('type'),
        dataIndex: 'isLeaf',
        key: 'isLeaf',
        width: 80,
        render: (text: boolean) => (
          <Tag color={text ? 'green' : 'orange'}>{text ? t('leafNode') : t('parentNode')}</Tag>
        ),
      },
    ] as ProColumns<MenuRecord>[],

    // 表单字段配置
    formFields: [
      {
        name: 'parentId',
        label: t('parentMenu'),
        type: 'select' as const,
        options: [], // 这里应该从API获取菜单树数据
      },
      {
        name: 'displayOrder',
        label: t('displayOrder'),
        type: 'number' as const,
        rules: [{ required: true }],
        props: {
          min: 1,
          max: 999,
        },
      },
      {
        name: 'resourceName',
        label: t('resourceName'),
        type: 'input' as const,
        rules: [{ required: true }],
      },
      {
        name: 'resourceUrl',
        label: t('resourceUrl'),
        type: 'input' as const,
        rules: [{ required: true }],
      },
      {
        name: 'icon',
        label: t('icon'),
        type: 'input' as const,
      },
      {
        name: 'permissions',
        label: t('permissionConfig'),
        type: 'select' as const,
        rules: [{ required: true }],
        props: {
          allowClear: true,
          mode: 'multiple',
        },
        options: DICT_CONSTANTS.PERMISSION_BUTTON,
      },
    ] as FormFieldConfig[],

    // 字典枚举配置
    dictEnum: {
      // 可以在这里添加字典枚举配置
    },
  };
};
